<template>
  <div class="controls-container">
    <el-input
      :size="size"
      suffix-icon="el-icon-search"
      placeholder="按名称查找现有成员"
      v-model="value"
    />
  </div>
</template>

<script>
export default {
  name: 'QueryNickname',
  props: {
    size: {
      type: String,
      default: 'small',
    },
    noRouter: Boolean,
  },
  data() {
    return {
      value: this.$route.query.nickname || '', // 筛选的成员名
    };
  },
  watch: {
    value() {
      setTimeout(() => {
        if (this.noRouter) this.$emit('update:nickname', this.value.trim());
        else this.$root.$emit('addQuery', { nickname: this.value.trim() || undefined });
      }, 300);
    },
  },
};
</script>

<style></style>
